import { createRouter, createWebHashHistory, type RouteRecordRaw } from 'vue-router'
import useUserStore from '@/stores/user'

declare module 'vue-router' {
  interface RouteMeta {
    /**
     * 标题
     */
    title?: string
    /**
     * 是否显示topbar
     * @default true
     */
    isShowTopBar?: boolean
    /**
     * tabBars 路由附加信息-icon
     */
    icon?: string
    /**
     * 是否需要检查token
     * @default true
     */
    isCheckToken?: boolean
    /**
     * tabTitle tabBar标题
     */
    tabTitle?: string
    /**
     * navConfig navBar右侧图标相关配置，navIcon：图标，navPath跳转路径
     */
    navConfig?: {
      navIcon?: string
      navPath?: string
    }
  }
}

export const tabBars: readonly RouteRecordRaw[] = [
  {
    path: '/home',
    name: 'home',
    meta: {
      isCheckToken: false,
      title: '体育课堂',
      tabTitle: '首页',
      icon: 'home-o',
      isShowTopBar: true,
    },
    component: () => import('../views/tabbar/A.vue'),
  },
  {
    path: '/course',
    name: 'course',
    meta: {
      isCheckToken: false,
      title: '课程',
      tabTitle: '课程',
      icon: 'bookmark-o',
    },
    component: () => import('../views/tabbar/B.vue'),
  },
  {
    path: '/my',
    name: 'my',
    meta: {
      isCheckToken: false,
      title: '我的',
      tabTitle: '我的',
      icon: 'friends-o',
      navConfig: {
        navIcon: 'setting',
        navPath: '/my/setting',
      },
    },
    component: () => import('../views/tabbar/C.vue'),
  },
]

const router = createRouter({
  history: createWebHashHistory(import.meta.env.BASE_URL),
  routes: [
    ...tabBars,
    {
      path: '/',
      redirect: '/login',
    },
    {
      path: '/login',
      component: () => import('../views/Login/index.vue'),
      meta: {
        title: '登录',
        isShowTopBar: false,
        isCheckToken: false,
      },
    },
    {
      path: '/forgetPsd',
      component: () => import('../views/Login/forgetPsd.vue'),
      meta: {
        title: '忘记密码',
        isShowTopBar: false,
        isCheckToken: false,
      },
    },
    {
      path: '/homework',
      name: 'homework',
      meta: {
        title: '课后作业',
      },
      component: () => import('../views/tabbar/my/homework.vue'),
    },
    {
      path: '/homeworkDetail',
      name: 'homeworkDetail',
      meta: {
        title: '课后作业详情',
      },
      component: () => import('../views/tabbar/my/homeworkDetail.vue'),
    },
    {
      path: '/practise',
      component: () => import('../views/home/practise/index.vue'),
      meta: {
        title: '小组练习',
      },
    },
    {
      path: '/practiseDetail',
      component: () => import('../views/tabbar/course/practiseDetail.vue'),
      meta: {
        title: '小组练习详情',
      },
    },
    {
      path: '/studentPractiseDetail',
      component: () => import('../views/tabbar/course/studentPractiseDetail.vue'),
      meta: {
        title: '学生练习详情',
      },
    },
    {
      path: '/test',
      component: () => import('../views/test.vue'),
      meta: {
        title: '测试',
        isCheckToken: false,
      },
    },
    {
      path: '/test2',
      component: () => import('../views/test2.vue'),
      meta: {
        title: '测试2',
        isCheckToken: false,
      },
    },
    {
      path: '/my/setting',
      name: 'my-setting',
      meta: {
        title: '设置',
      },
      component: () => import('../views/tabbar/my/setting.vue'),
    },
    {
      path: '/my/psersonal',
      name: 'my-psersonal',
      meta: {
        title: '个人信息',
      },
      component: () => import('../views/tabbar/my/personal.vue'),
    },
    {
      path: '/my/psersonalPwd',
      name: 'my-psersonalPwd',
      meta: {
        title: '修改密码',
      },
      component: () => import('../views/tabbar/my/psersonalPwd.vue'),
    },
  ],
})

export default router

// 页面加载完成后，移除加载动画（app启动）
router.isReady().then(() => {
  document.querySelector('#app-loading')?.remove()
})

// 设置页面标题
router.afterEach((to) => {
  let title = to.meta.title || ''
  title &&= title + ' - '
  document.title = title + __ENV__.VITE_APP_TITLE
})

// 判断是否登录
router.beforeEach((to, _from, next) => {
  if (to.meta.isCheckToken === false || useUserStore().token) {
    next()
  } else if (to.path === '/Login') {
    next()
  } else {
    next('/Login')
  }
})
